<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="format-detection" content="telephone=no">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="UTF-8">
    <title>index.html</title>
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/index.css">

</head>
<body>

<div class="header">
    <div class="h-top">
        <div><img src="images/图书---豆瓣_01.jpg" alt=""></div>

        <div class="h-top1">
            <div>
                <a href="#">
                    <span class="wz1">豆瓣APP</span><br>
                    <span class="wz2">记录你的影音生活</span>
                </a>
            </div>
            <div class="wz3">
                <a href="#">打开APP</a>
            </div>
        </div>
    </div>
    <div class="h-center">
        <div class="h-center1">
            <span class="wz4">最受关注图书类 | 虚构类</span>
            <span class="wz5"><a href="#">更多</a></span>
        </div>
        <ul>
            <li><a href="#"><img src="./images/图书---豆瓣_03.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/图书---豆瓣_02.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/图书---豆瓣_04.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/图书---豆瓣_05.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/图书---豆瓣_06.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/图书---豆瓣_07.jpg" alt=""></a></li>
        </ul>
    </div>
    <div class="h-bottom">
        <div class="h-bottom1">
            <span class="wz6">最受关注图书类 | 非虚构类</span>
            <span class="wz7"><a href="#">更多</a></span>
        </div>
        <ul>
            <li><a href="#"><img src="./images/图书---豆瓣_08.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/图书---豆瓣_09.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/图书---豆瓣_10.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/图书---豆瓣_11.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/图书---豆瓣_12.jpg" alt=""></a></li>
            <li><a href="#"><img src="./images/图书---豆瓣_13.jpg" alt=""></a></li>
        </ul>
    </div>
</div>

<div class="center">
    <div class="c-top">
        <div class="c-top1">
            <span class="wz8">豆瓣书店</span>
            <span class="wz9"><a href="#">更多</a></span>
        </div>

        <div class="c-top2">
            <img src="./images/图书---豆瓣_14.jpg" alt="">
            <div class="c-top3">
                <div>
                    <span class="wz10">你好小朋友复刻版</span><br>
                    <span class="wz11">116张照片带你找回闪亮童年</span>
                </div>
                <div class="wz12">$390</div>
            </div>
        </div>
    </div>
    <div class="c-center">
        <ul>
            <li><a href=""><img src="./images/图书---豆瓣_15.jpg" alt=""></a></li>
            <li><a href=""><img src="./images/图书---豆瓣_16.jpg" alt=""></a></li>
            <li><a href=""><img src="./images/图书---豆瓣_17.jpg" alt=""></a></li>
            <li><a href=""><img src="./images/图书---豆瓣_18.jpg" alt=""></a></li>
            <li><a href=""><img src="./images/图书---豆瓣_19.jpg" alt=""></a></li>
            <li><a href=""><img src="./images/图书---豆瓣_20.jpg" alt=""></a></li>
        </ul>


    </div>
    <div class="c-bottom">
        <span>发现好图书</span>
        <ul>
            <li class="wz13"><a href="#">小波看书</a></li>
            <li class="wz14"><a href="#">村上春树周边</a></li>
            <li class="wz15"><a href="#">我凭名字认定了你</a></li>
            <li class="wz16"><a href="#">不可饶恕的女人们</a></li>
            <li class="wz17"><a href="#">爱欲书</a></li>
            <li class="wz18"><a href="#">他们还写侦探小说</a></li>
            <li class="wz19"><a href="#">人生识字始忧患</a></li>
            <li class="wz20"><a href="#">诗歌书店</a></li>
        </ul>


    </div>
</div>

<div class="bottom">
    <div class="b-top">
        <span>分类浏览</span>
        <ul>
            <li><a href="#">小说</a></li>
            <li><a href="#">爱情</a></li>
            <li><a href="#">历史</a></li>
            <li><a href="#">外国文学</a></li>
            <li><a href="#">青春</a></li>
            <li><a href="#">励志</a></li>
            <li><a href="#">随笔</a></li>
            <li><a href="#">传记</a></li>
            <li><a href="#">推理</a></li>
            <li><a href="#">旅行</a></li>
            <li><a href="#">奇幻</a></li>
            <li><a href="#">经营</a></li>
        </ul>
    </div>
    <div class="b-bottom">
        <div class="b-bottom1">
            <img src="./images/图书---豆瓣_21.jpg" alt="">
            <b>豆瓣</b>
        </div>
        <span>免费下载Android客户端</span>

    </div>


</div>
</body>
</html>